@import "tailwindcss";
@import "tw-animate-css";

@plugin "daisyui";
@custom-variant dark (&:is(.dark *));

@theme inline {
  --color-background: hsl(var(--background));
  --color-foreground: hsl(var(--foreground));
  --color-card: hsl(var(--card));
  --color-card-foreground: hsl(var(--card-foreground));
  --color-popover: hsl(var(--popover));
  --color-popover-foreground: hsl(var(--popover-foreground));
  --color-primary: hsl(var(--primary));
  --color-primary-foreground: hsl(var(--primary-foreground));
  --color-secondary: hsl(var(--secondary));
  --color-secondary-foreground: hsl(var(--secondary-foreground));
  --color-muted: hsl(var(--muted));
  --color-muted-foreground: hsl(var(--muted-foreground));
  --color-accent: hsl(var(--accent));
  --color-accent-foreground: hsl(var(--accent-foreground));
  --color-destructive: hsl(var(--destructive));
  --color-destructive-foreground: hsl(var(--destructive-foreground));
  --color-border: hsl(var(--border));
  --color-input: hsl(var(--input));
  --color-ring: hsl(var(--ring));
  --color-chart-1: hsl(var(--chart-1));
  --color-chart-2: hsl(var(--chart-2));
  --color-chart-3: hsl(var(--chart-3));
  --color-chart-4: hsl(var(--chart-4));
  --color-chart-5: hsl(var(--chart-5));
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --color-sidebar: hsl(var(--sidebar));
  --color-sidebar-foreground: hsl(var(--sidebar-foreground));
  --color-sidebar-primary: hsl(var(--sidebar-primary));
  --color-sidebar-primary-foreground: hsl(var(--sidebar-primary-foreground));
  --color-sidebar-accent: hsl(var(--sidebar-accent));
  --color-sidebar-accent-foreground: hsl(var(--sidebar-accent-foreground));
  --color-sidebar-border: hsl(var(--sidebar-border));
  --color-sidebar-ring: hsl(var(--sidebar-ring));
  --animate-accordion-down: accordion-down 0.2s ease-out;
  --animate-accordion-up: accordion-up 0.2s ease-out;
}
@layer utilities {
  .mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }
  .w-17 {
    width: calc(var(--spacing) * 17);
  }
  .text-little  {
    font-size: 15px;
  }
  .pr-29 {
    padding-right: calc(var(--spacing) * 29);
  }
}
:root{
  --background: 0 0% 100%;
  --foreground: 0 0% 3.9%;

  --card: 0 0% 100%;
  --card-foreground: 0 0% 3.9%;

  --popover: 0 0% 100%;
  --popover-foreground: 0 0% 3.9%;

  --primary: 0 72.2% 50.6%;
  --primary-foreground: 0 85.7% 97.3%;

  --secondary: 0 0% 96.1%;
  --secondary-foreground: 0 0% 9%;

  --muted: 0 0% 96.1%;
  --muted-foreground: 0 0% 45.1%;

  --accent: 0 0% 96.1%;
  --accent-foreground: 0 0% 9%;

  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 0 0% 98%;

  --border:0 0% 89.8%;
  --input:0 0% 89.8%;
  --ring:0 72.2% 50.6%;
  --radius: 0.5rem;





   --vis-tooltip-background-color: none !important;
    --vis-tooltip-border-color: none !important;
    --vis-tooltip-text-color: none !important;
    --vis-tooltip-shadow-color: none !important;
    --vis-tooltip-backdrop-filter: none !important;
    --vis-tooltip-padding: none !important;

    --vis-primary-color: var(--primary);
    /* change to any hsl value you want */
    --vis-secondary-color: 160 81% 40%;
    --vis-text-color: var(--muted-foreground);
    --chart-1: 12 76% 61%;
    --chart-2: 173 58% 39%;
    --chart-3: 197 37% 24%;
    --chart-4: 43 74% 66%;
    --chart-5: 27 87% 67%;



  --clr-data:     oklch(76% 0.21 350);  /* 暖玫瑰红 */
  --clr-message:  var(--clr-data);

  --clr-tool:     oklch(78% 0.18 100);  /* 杏黄灰 */
  --clr-llm:      oklch(70% 0.19 288);  /* 深靛蓝紫 */

  --clr-memory:   oklch(64% 0.15 135);  /* 低饱绿，压亮度 */
  --clr-any:      oklch(60% 0.13 175);  /* 稳重青绿 */
  --clr-embed:    oklch(62% 0.14 240);  /* 云蓝灰 */

  --clr-b64:      oklch(68% 0.13 50);   /* 陶瓷橙棕 */
  --clr-messages: oklch(68% 0.14 340);  /* 深玫瑰粉 */

  /* === Handle 点（input/output） === */
  --handle-source: #d23c74;           /* 明显粉红（输出） */
  --handle-target: #2977f5;           /* 深蓝（输入） */
  --handle-invalid: #c2c2c2;

  /* === Code Block === */
  --code-bg: #f9f9fb;                 /* 类 Notion 纸张灰 */
  --code-fg: #2b2b2b;                 /* 更沉稳字体色 */

   --timing-color: #2977f5; /* Light 模式下的蓝 */
}

.dark {
    --foreground: 0 0% 100%; /* hsl(0, 0%, 100%) */
    --background: 240 6% 10%; /* hsl(240, 6%, 10%) */
    --muted: 240 4% 16%; /* hsl(240, 4%, 16%) */
    --muted-foreground: 240 5% 65%; /* hsl(240, 5%, 65%) */
    --card: 240 4% 16%; /* hsl(240, 6%, 10%) */
    --card-foreground: 0 0% 100%; /* hsl(0, 0%, 100%) */
    --popover: 240 4% 16%; /* hsl(240, 6%, 10%) */
    --popover-foreground: 0 0% 100%; /* hsl(0, 0%, 100%) */
    --border: 240 5% 26%; /* hsl(240, 5%, 26%) */
    --input: 240 5% 34%; /* hsl(240, 5%, 34%) */
    --primary-foreground: 0 0% 0%; /* hsl(0, 0%, 0%) */
    --primary: 0 0% 100%; /* hsl(0, 0%, 100%) */
    --secondary: 0 0% 0%; /* hsl(0, 0%, 0%) */
    --secondary-foreground: 240 6% 90%; /* hsl(240, 6%, 90%) */
    --accent: 240 4% 16%; /* hsl(240, 4%, 16%) */
    --accent-foreground: 0 0% 100%; /* hsl(0, 0%, 100%) */
    --destructive: 0 84% 60%; /* hsl(0, 84%, 60%) */
    --destructive-foreground: 0 0% 100%; /* hsl(0, 0%, 100%) */
    --ring: 0 0% 100%; /* hsl(0, 0%, 100%) */
    --primary-hover: 240 6% 90%; /* hsl(240, 6%, 90%) */
    --secondary-hover: 240 4% 16%; /* hsl(240, 4%, 16%) */
    --placeholder-foreground: 240 4% 46%; /* hsl(240, 4%, 46%) */
    --canvas: 0 0% 0%; /* hsl(0, 0%, 0%) */
    --canvas-dot: 240 5.3% 26.1%; /* hsl(240, 5.3%, 26.1%) */


   /* -------- 连线语义色：仍沿用你满意的暗色 -------- */
  --clr-data:        pink;   
  --clr-message:    var(--clr-data);

  --clr-memory:     oklch(60% 0.18 58.318);
  --clr-tool:       yellow;

  --clr-llm:        oklch(70% 0.12 306.383);
  --clr-embed:      oklch(75% 0.06 254.128);

  --clr-any:        oklch(67% 0.20 151.711);
  --clr-b64:        oklch(72% 0.22 128.85);

  --clr-messages:   oklch(70% 0.12 346.018);

   --handle-source:  hotpink;     
  --handle-target:  aquamarine;
  --handle-invalid: #bdbdbd;     

   --code-bg:        #1e1e1e;   /* 深色底：VS Code 默认 */
  --code-fg:        #d1d5db;   /* 浅灰文字 */
    --timing-color: #4ade80; /* Dark 模式下的绿 */
}
  
@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground;
  }
}

